<template>
  <div class="search-songs">
    <music-item :musiclist='musiclist'
                @musicItemClick="musicItemClick" />
  </div>
</template>

<script>
import { _Search } from 'network/search'
import { _getSongsDetail, SongDetail } from "network/detail"
import MusicItem from '../../musicListDetail/childComps/MusicItem.vue'
import { indexMixin } from 'mixin/indexMixin'
export default {
  components: { MusicItem },
  name: 'SearchSongs',
  data () {
    return {
      searchType: 1,
      // 歌曲列表
      musiclist: [],
      keywords: ''
    };
  },
  mixins: [indexMixin],
  created () {
    this.Search();
  },
  methods: {
    // 获取搜索单曲
    Search () {
      // 获取活跃路由参数
      this.keywords = this.$route.params.key;
      _Search(this.keywords, this.searchType).then(res => {
        for (const i of res.data.result.songs) {
          // 根据歌曲的id获取 歌曲详情
          _getSongsDetail(i.id).then(res => {
            const song = new SongDetail(res.data.songs)
            this.musiclist.push(song)
          })
        }
      })
    },
    musicItemClick (index) {
      this.PlayMusic(index);
    }
  },
}
</script>

<style scoped>
</style>
